import Header from "@/components/header";
import styles from "./index.module.scss";
// import MlsMenu from "./mlsMenu/index";
import MenuBar from "@/components/common/mlsMenuBar/index";
import { useState } from "react";
// 导入Outlet组件
import { Outlet } from "react-router-dom";
import { AUDIO_MENU_LIST } from "./constants";

export default function AudioEditPage() {
  // const [currentMenuKey, setCurrentMenuKey] = useState("text");
  // const [currentMenuTitle, setCurrentMenuTitle] = useState("文生图");
  const handleMenuClick = (item, confirmCallback) => {
    // 更新当前选中的菜单
    // console.log(item);
    // setCurrentMenuKey(item.key);
    // setCurrentMenuTitle(item.title);
    // 调用回调更新菜单状态
    confirmCallback?.();
  };

  return (
    <div className={styles.audioEditPage} id="audioEditPage">
      <Header showLogo={false} title="音频工作台" backHome={true} />
      <div className={styles.mainSection}>
        <div className={styles.mainContent}>
          <MenuBar
            menuList={AUDIO_MENU_LIST}
            onMenuChange={handleMenuClick}
          />
          {/* 添加Outlet组件用于渲染子路由内容 */}
          <div className={styles.subRouteContent}>
            <Outlet />
          </div>
        </div>
      </div>
    </div>
  );
}
